<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>级联样式表设置颜色(Cascading Style Sheets)</title>
  <!-- 
  CSS中设置颜色的方法有多种，可以通过颜色名称、十六进制值、RGB值、RGBA值、HSL值、HSLA值等方式来指定颜色。以下是对不同设置颜色方法的总结： 
 
    1. 使用颜色名称：可以直接使用预定义的颜色名称来表示颜色，例如 red 、 blue 、 green 等。 
    
    2. 使用十六进制值：可以使用十六进制表示法来指定颜色，例如 #ff0000 表示红色、 #00ff00 表示绿色。 
    
    3. 使用RGB值：可以使用RGB（红绿蓝）表示法来指定颜色，例如 rgb(255, 0, 0) 表示红色、 rgb(0, 255, 0) 表示绿色。 
    
    4. 使用RGBA值：在RGB值的基础上，还可以指定透明度（alpha通道），例如 rgba(255, 0, 0, 0.5) 表示半透明的红色。 
    
    5. 使用HSL值：可以使用HSL（色相、饱和度、亮度）表示法来指定颜色，例如 hsl(0, 100%, 50%) 表示红色。 
    
    6. 使用HSLA值：在HSL值的基础上，同样可以指定透明度，例如 hsla(0, 100%, 50%, 0.5) 表示半透明的红色。
  -->
  <style>
    .cascading-style-sheets-setting-color {
      /* 颜色名称: red/white/black/yellow... */
      color: red;
      background-color: white;

      /* 纯黑色 */
      background-color: rgb(100, 100, 100);
      background-color: #646464;

      /* 透明度为0.5的红色 */
      background-color: rgba(255, 0, 0, 0.5);
      background-color: #ff000080;
      
      /* 透明度为0.5的红色 */
      background-color: hsla(0, 100%, 50%, 0.5);
      background-color: hsl(0, 100%, 50%)80;
    }
  </style>
</head>
<body>

  <div class="cascading-style-sheets-setting-color">
    cascading-style-sheets-setting-color
  </div>
  
</body>
</html>